<template>
	<view class="page">
		<view class="wrapper">
			<view class="flex">
				<image class="img" src="../../static/images/usdt.png" v-show="type=='usdt'" mode="aspectFill"></image>
				<image class="img" src="../../static/images/epc.png" v-show="type=='epc'" mode="aspectFill"></image>
				
				<view class="yue">
					<view class="">
						可用余额：
					</view>
					<view class="text-white">
						{{type=='usdt'?usdt:epc}}
					</view>
				</view>
			</view>
			
			<view class="margin-top">
				<form>
					<view class="cu-form-group">
						<view class="title">提币数量</view>
						<input class="ipt" placeholder="请输入" type="number" name="input" v-model="amount"></input>
					</view>
					<view class="cu-form-group">
						<view class="title">目标地址</view>
						<input class="ipt" placeholder="请输入" name="input" v-model="address"></input>
						<!-- #ifndef H5 -->
						<text class='cuIcon-scan icon text-white' @click="scan"></text>
						<!-- #endif -->
					</view>
					<view class="my-group">
						<view class="row sm" v-show="type=='usdt'">
							提币方式默认erc20 手续费数量：{{feeMoney}}
						</view>
						<view class="row">
							<view class="title">
								到账数量：
							</view>
							<view class="text-green">
								{{amount-feeMoney}}
							</view>
						</view>
					</view>
					
					<view class="btn-wrrapper">
						<button class="cu-btn btn block radius bg-green" @click="draw">
							确认提币
						</button>
					</view>
					
				</form>
			</view>
			
			<view class="tishi">
				<view class="text-white">
					温馨提示
				</view>
				<view class="p">
					1.最少提币数量100枚
				</view>
				<view class="p">
					2.最大提币数量10000枚
				</view>
				<view class="p">
					3.提币数量为10的整数倍
				</view>
				<view class="p">
					4.提币数量小于{{parseInt(fee.benefit_limit)}}手续费按{{fee.fee}}%收取，提币数量大于等于{{parseInt(fee.benefit_limit)}}手续费按{{fee.benefit_fee}}%收取
				</view>
				<view class="p">
					5.为保障资金安全，当您账户安全策略变更、密码修改、我们会对提币进行人工审核，请耐心等待工作人员电话或邮件联系。请务必确认电脑及浏览器安全，防止信息被篡改或泄露。
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type: '',
				usdt: 0,
				epc: 0,
				final: 0,
				amount: 100,
				address: '',
				fee: ''
			}
		},
		computed: {
			feeMoney() {
				if (this.fee) {
					let limit = parseInt(this.fee.benefit_limit)
					if (this.amount >= limit) {
						return this.amount*this.fee.benefit_fee/100
					} else {
						return this.amount*this.fee.fee/100
					}
				}
			}
		},
		onLoad(opt) {
			this.type = opt.type
		},
		onShow() {
			this.getInfo();
		},
		methods: {
			getInfo() {
				this.$u.get('/finance/wallet').then(res => {
					this.usdt = res.data.result.userfund.usdt
					this.epc = res.data.result.userfund.epc
					this.fee = res.data.result.fee
				})
			},
			draw() {
				if (this.amount<=10000 && this.amount>=100 && this.address) {
					let data = {
						amount: this.amount,
						address: this.address
					}
					this.$u.post('/finance/draw?type=' + this.type, data).then(res => {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
						this.getInfo();
					})
				} else {
					uni.showToast({
						title: '请输入有效信息',
						icon: 'none'
					})
				}
			},
			scan() {
				uni.scanCode({
					success: res => {
						this.address = res.result
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.flex {
		display: flex;
		flex-flow: column;
		align-items: center;
		.img {
			width: 100rpx;
			height: 100rpx;
			margin: 60rpx 0;
		}
		.yue {
			margin-top: -30rpx;
			display: flex;
			align-items: center;
		}
	}
	
	.row {
		display: flex;
		align-items: center;
		padding: 10rpx 30rpx;
		&.sm {
			font-size: 26rpx;
		}
		.title {
			color: #fff;
		}
	}
	
	.tishi {
		line-height: 1.8;
		font-size: 26rpx;
		margin-top: 100rpx;
		.p {
			padding-left: 1em;
			line-height: 1.8;
			text-indent: -1em;
		}
	}
	
	.uni-input-input {
		color: #fff !important;
	}
	.cu-form-group {
		background: #242644;
		border-color: #393C52;
		.title {
			width: 180rpx;
			color: #fff;
		}
		.ipt {
			color: #fff;
		}
		.icon {
			font-size: 50rpx;
		}
	}
	.btn-wrrapper {
		padding: 0 50rpx;
		.btn {
			background-color: #00D388;
			margin-top: 100rpx;
		}
	}	                          
</style>
